<div fxLayout="row">
  <div class="profile m-r-20" fxFlex="340px">
    <mat-card fxFlex>
      <div mat-card-image class="profile-image"></div>
      <div class="profile-image-avatar text-center">
        <img class="avatar" src="https://lh5.googleusercontent.com/-hcRNe540rco/AAAAAAAAAAI/AAAAAAAAAAk/DfS45tpAR-A/photo.jpg">
      </div>
      <mat-card-content class="text-center">
        <h4 class="mat-card-title">stbui</h4>
        <h6 class="mat-card-subtitle">前端工程师</h6>
      </mat-card-content>
      <mat-card-actions>
        <stbui-github-button type="link|star|fork"></stbui-github-button>
      </mat-card-actions>
    </mat-card>
  </div>

  <mat-card fxFlex>
    <mat-card-title>我的信息</mat-card-title>
    <mat-card-content>
      <form fxLayout="column" #formContact="ngForm">
        <mat-form-field class="display-block">
          <input matInput placeholder="您的名字" name="name" ngModel required minlength="4" maxlength="10">
        </mat-form-field>
        <mat-form-field class="display-block">
          <input matInput placeholder="您的邮箱" name="email" ngModel required>
        </mat-form-field>
        <mat-form-field class="display-block">
          <input matInput placeholder="您的手机" name="phone" ngModel required>
        </mat-form-field>
        <mat-form-field class="display-block">
          <input matInput placeholder="请您的网址" name="website ngModel" required>
        </mat-form-field>
        <mat-form-field class="display-block">
          <textarea matInput placeholder="留言" rows="3" name="message" ngModel required></textarea>
        </mat-form-field>
        <button mat-raised-button color="primary" type="submit" [disabled]="!formContact.valid">更新资料</button>
      </form>
    </mat-card-content>
  </mat-card>
</div>